<template>
  <div>
    <h1>sup-b:{{myname}}</h1>
    .native 。

    <!-- 通俗点讲：就是在父组件中给子组件绑定一个原生的事件，就将子组件变成了普通的HTML标签，
    不加'. native'事件是无法触  发的。 -->
    <zi-com :abc="'abc'">
      <template slot-scope="slotScope">
        <div>
          <h1>这是给默认插槽传递的内容
            {{slotScope.obj.msg}}
            <br>
            {{slotScope.mykk}}
          </h1>
        </div>
      </template>
      <template #head>
        <div>
          <h1>这是头部</h1>
        </div>
      </template>
      <template #foot>
        <div>
          <h1>这是脚步部</h1>
        </div>
      </template>
    </zi-com>
  </div>
</template>

<script>
import ziCom from './zicom.vue'
export default {
  name: 'Ljfvue2011Supb',
  inject: ["myname"],
  components: { ziCom },
  data () {
    return {

    };
  },

  mounted () {
    // this.$root 获取到根组件
    console.log(this.$root.age)
    this.$root.age = 20;
    // $isServer 判断vue当前是否在服务器下允许
    console.log(this.$isServer)
  },

  methods: {
    say () {
      alert(1)
    }
  },
};
</script>

<style lang="less" scoped>
</style>